<template>
	<view class="content">
		<u-navbar :autoBack="true" bgColor="rgba(0,0,0,0)" :fixed="true" @click-left="$back" ></u-navbar>
		
		<image :src="'/images/qbg_02.png' | formatImgUrl" class="bei" mode=""></image>
		<view class="dingbox" :style="{'padding-bottom': paddingBottomHeight + 'rpx'}">
			<view class="neibox">
				<view class="title">
					签约入团<br>
					福利享不停！
				</view>
				<view class="lvbg">
					<scroll-view scroll-y="true" class="huabox">
						<view class="huatitle">
							接单更简单
						</view>
						<view class="txt">
							接单分成不变，赚钱更加简单
						</view>
						<view class="huatitle">
							获得额外奖励
						</view>
						<view class="txt">
							团队额外接单奖励，活动奖励
						</view>
						<view class="huatitle">
							团队专属抢单功能
						</view>
						<view class="txt">
							每天发单，即时抢单！无需等待，主动出击
						</view>
						<view class="huatitle">
							免费接单培训
						</view>
						<view class="txt">
							团队免费进行接单培训，贴心辅导，速度成长
						</view>
						<view class="huatitle">
							平台信息早知道
						</view>
						<view class="txt">
							平台最新规则，活动早知道，信息快人一步
						</view>
						<view class="huatitle">
							扩列交友
						</view>
						<view class="txt">
							认识更多志趣相投的优秀写手，拒绝瓶颈
						</view>
					</scroll-view>
				</view>
			</view>
			<view class="dibai">
				<view class="addbox" @click="$go('/pages/user/hot')">
					签约入团，并填写审核申请
				</view>
				<view class="jujue" @click="goMyPage">
					拒绝签约入团，个人接单
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	export default { 
		data() {
			return {
				paddingBottomHeight: 0, //苹果X以上手机底部适配高度
			}
		},
		onLoad() {

		},
		created() {
		   let that = this;
		   uni.getSystemInfo({
		      success: function(res) {
		         let model = ['X', 'XR', 'XS', '11', '12', '13', '14', '15'];
		         model.forEach(item => {
		            //适配iphoneX以上的底部，给tabbar一定高度的padding-bottom
		            if (res.model.indexOf(item) != -1 && res.model.indexOf('iPhone') != -1) {
		               that.paddingBottomHeight = 40;
		            }
		         })
		      }
		   });
				 var url = getCurrentPages() 
				 this.urlPath = '/' + url[0].route
				 
		},
		methods: {
			goMyPage(){
				uni.navigateBack()
			}
		}
	}
</script>

<style lang="scss">
	page {
		background: rgba(242, 245, 242, 1);
	}
	.content {
		position: relative;
		padding: 102rpx 0;
		padding-top: 154px;
		
		.bei{
			width: 100%;
			height: 100vh;
			position: fixed;
			left: 0;
			top: 0;
			z-index: -1;
		}
		.dingbox{
			position: fixed;
			left: 0;
			bottom: 0;
			width: 100%;
			.neibox{
				padding: 0 75rpx;
				.title{
					font-size: 72rpx;
					font-weight: bold;
					letter-spacing: 0px;
					line-height: 104rpx;
					padding-bottom: 48rpx;
					color: #45C4B0;
				}
				.lvbg{
					border-top-left-radius: 30px;
					border-top-right-radius: 30px;
					height: 740rpx;
					padding-top: 28rpx;
					background: #45C4B0;
					box-shadow: 0px 4px 10px 0px #45C4B0,inset 0px 4px 10px 0px rgba(255, 255, 255, 0.3);
					.huabox{
						padding: 0 48rpx;
						width: 504rpx;
						height: 740rpx;
						.huatitle{
							padding-bottom: 8rpx;
							font-size: 36rpx;
							font-weight: bold;
							line-height: 40rpx;
							letter-spacing: 0px;
							color: #FFFFFF;
						}
						.txt{
							font-size: 24rpx;
							font-weight: normal;
							line-height: 48rpx;
							letter-spacing: 0px;
							color: #FFFFFF;
							padding-bottom: 28rpx;
						}
					}
				}
			}
			.dibai{
				background-color: #FFFFFF;
				padding: 20rpx 60rpx;
				.addbox{
					height: 80rpx;
					border-radius: 8px;
					opacity: 1;
					margin-bottom: 20rpx;
					background: #45C4B0;
					line-height: 80rpx;
					text-align: center;
					font-size: 28rpx;
					font-weight: bold;
					text-align: center;
					letter-spacing: 0em;
					color: #FFFFFF;
				}
				.jujue{
					height: 80rpx;
					border-radius: 8px;
					opacity: 1;
					background: #3D3D3D;
					line-height: 80rpx;
					text-align: center;
					font-size: 28rpx;
					font-weight: bold;
					text-align: center;
					letter-spacing: 0em;
					color: #FFFFFF;
				}
			}
		}
		
	}
</style>